<template>
  <a-modal
    :visible="visible"
    :width="400"
    :confirm-loading="loading"
    :title="title"
    @ok="handleOk"
    @cancel="handleCancel"
  >
    <a-range-picker v-model:value="date" @change="onChange" />
  </a-modal>
</template>

<script>
import { getDatesInRange } from '@/utils/util'

export default {
  name: 'HfAddDeliveryDateList',
  data() {
    return {
      date: [],
      visible: false,
      add: false,
      loading: false,
      dateList: []
    }
  },
  computed: {
    title() {
      return `请选择要${this.add ? '添加' : '修改'}的日期区间`
    }
  },
  methods: {
    onChange(value) {
      this.dateList = getDatesInRange(value[0], value[1])
    },
    handleOk() {
      this.$emit('onDateListChange', this.dateList, this.add)
      this.handleCancel()
    },
    handleCancel() {
      this.visible = false
      this.dateList = []
      this.date = []
    }
  }
}
</script>

<style scoped></style>
